import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import styleImport, { VantResolve } from "vite-plugin-style-import";
import { viteMockServe } from 'vite-plugin-mock'

import pxtovw from 'postcss-px-to-viewport'
import path from "path"
const loder_pxtovw=pxtovw({
  viewportWidth: 750,
  // exclude:[/node_modules/],
  selectorBlackList:['.ignore-'],
  customFun: ({ file }) => {
    // console.log("aaaa") 
    // console.log(file)
    // 这个自定义的方法是针对处理vant组件下的设计稿为375问题
    const designWidth = path.join(file).includes(path.join("node_modules", "vant")) ? 375 : 750;
   
    return designWidth;
  }
})
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue(),
    styleImport({
      resolves: [VantResolve()],
      libs: [
        {
          libraryName: "vant",
          esModule: true,
          resolveStyle: (name) => {
            return `../es/${name}/style/index`;
          },
        },
      ],
    }), viteMockServe({
      supportTs:false,
      logger: false,
      mockPath: "./mock/"
    })],
    resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src')
    }
  },
  server:{
    proxy:{
       "/app": {
        target: "http://120.53.31.103:84/api/app",
        changeOrigin:true,
        rewrite:path=>path.replace(/^\/app/,'')
      }
    }
  },
   css: {
      postcss:{
          plugins: [loder_pxtovw]
      }
    },
})
